<template xmlns="">
  <div style="background-color: #F2F2F2;color: #606266;min-height: 100vh;">
    <blue-nav/>
    <el-row type="flex" justify="center">
      <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" style="margin-bottom: 10px"
               @select="handleSelect">
        <el-menu-item index="1">模型管理</el-menu-item>
        <el-menu-item index="2">部署管理</el-menu-item>
        <el-menu-item index="3">实例</el-menu-item>
        <el-menu-item index="4">任务</el-menu-item>
        <el-menu-item index="5">历史</el-menu-item>
        <el-menu-item index="6">表单管理</el-menu-item>
        <el-menu-item index="7" @click="toUrl('http://127.0.0.1:9005/small-service-flowable/index.html#/processes')">
          编辑流程
        </el-menu-item>
      </el-menu>
    </el-row>
    <el-row type="flex" justify="center">
      <div style="width: 95vw">
        <router-view/>
      </div>
    </el-row>
  </div>
</template>

<script>

import blueNav from "@/components/blueNav";
export default {
  name: 'flowable',
  components: {blueNav},
  data() {
    return {
      activeIndex: '1',
      path: ['/flow/bpmnModel', '/flow/processDefinition', "/flow/processInstance", "/flow/task", '/flow/processInstanceHistory', '/flow/formList'],
    }
  },
  mounted() {

  },
  methods: {
    handleSelect(key, keyPath) {
      console.log(key, keyPath);
      this.$router.push({path: this.path[key - 1]})
    },
    toUrl(v) {
      window.location.href = v;
    },
  }
}
</script>

<style scoped lang="less">

.el-menu-demo {
  width: 95%;
  border-radius: 4px;
  //background-color: white;
}


</style>